<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta content="telephone=no" name="format-detection">
    <title>黎世阁-我的评价</title>
    <link rel="stylesheet" href="css/swiper.min.css"/>
    <link rel="stylesheet" href="css/public.css"/>
    <link rel="stylesheet" href="css/assess.css"/>
    <script src="js/jquery.min.js"></script>
    <script src="js/swiper.min.js"></script>
    <script type="text/javascript">
        (function (doc, win) {
            var docEl = doc.documentElement,
                resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
                recalc = function () {
                    var clientWidth = docEl.clientWidth;
                    if (!clientWidth) return;

                    docEl.style.fontSize = 100 * (clientWidth / 750) + 'px';

                };
            if (!doc.addEventListener) return;
            win.addEventListener(resizeEvt, recalc, false);
            doc.addEventListener('DOMContentLoaded', recalc, false);
            recalc();
        })(document, window);

    </script>
</head>
<body>
<!--头部开始-->
<header>
    <i class="iconfont left_jt">&#xe65b;</i>
    <div class="title">我的评价</div>
</header>
<!--头部结束-->
<!--导航-->
<nav>
	<div class="nav_item color_yellow">全部66</div>
	<div class="nav_item">有图评价32</div>
</nav>
<!--导航-->
<!--评价列表-->
<div class="swiper-containerBox">
	<div class="swiper-wrapper">
		<div class="swiper-slide">
			<div class="li_item" style="display: block;">
				<div class="speak_item clearfix">
					<div>
						<div class="people_img"></div>
						<div class="content">
							<span class="">小糯米</span>
							<div class="star_box clearfix">
								<img class="img1" src="img/star.png" alt="" />
								<img class="img1" src="img/star.png" alt="" />
								<img class="img1" src="img/star.png" alt="" />
								<img class="img1" src="img/star.png" alt="" />
								<img class="img2" src="img/star.png" alt="" />
							</div>
						</div>
						<span class="time">2016-09-02</span>
					</div>
					<div class="assess_content">这款书桌非常的漂亮，，看到的时候很惊喜呢！给身边朋友也介绍了，大家都赞不绝口！</div>
					<div class="type">
						<div>
							<span class="type_name">材质：</span><span class="material">进口松木/手绘艺术纸  </span>
						</div>
						<div>
							<span class="type_name">颜色： </span><span class="tinct">多色  </span>
						</div>
						<div>
							<span class="type_name">规格 : </span><span class="norms">长57.5X宽67.5X高2.8CMs</span>
						</div>
					</div>
				</div>
				<div class="speak_item clearfix">
					<div>
						<div class="people_img"></div>
						<div class="content">
							<span class="">小糯米</span>
							<div class="star_box clearfix">
								<img class="img1" src="img/star.png" alt="" />
								<img class="img1" src="img/star.png" alt="" />
								<img class="img1" src="img/star.png" alt="" />
								<img class="img1" src="img/star.png" alt="" />
								<img class="img2" src="img/star.png" alt="" />
							</div>
						</div>
						<span class="time">2016-09-02</span>
					</div>
					<div class="assess_content">这款书桌非常的漂亮，，看到的时候很惊喜呢！给身边朋友也介绍了，大家都赞不绝口！</div>
					<div class="assess-tu">
						<img src="img/assess.png" alt="" />
						<img src="img/assess.png" alt="" />
						<img src="img/assess.png" alt="" />
					</div>
					<div class="type">
						<div>
							<span class="type_name">材质：</span><span class="material">进口松木/手绘艺术纸  </span>
						</div>
						<div>
							<span class="type_name">颜色： </span><span class="tinct">多色  </span>
						</div>
						<div>
							<span class="type_name">规格 : </span><span class="norms">长57.5X宽67.5X高2.8CMs</span>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="swiper-slide">
			<div class="li_item">
				<div class="speak_item clearfix">
					<div>
						<div class="people_img"></div>
						<div class="content">
							<span class="">小糯米</span>
							<div class="star_box clearfix">
								<img class="img1" src="img/star.png" alt="" />
								<img class="img1" src="img/star.png" alt="" />
								<img class="img1" src="img/star.png" alt="" />
								<img class="img1" src="img/star.png" alt="" />
								<img class="img2" src="img/star.png" alt="" />
							</div>
						</div>
						<span class="time">2016-09-02</span>
					</div>
					<div class="assess_content">这款书桌非常的漂亮，，看到的时候很惊喜呢！给身边朋友也介绍了，大家都赞不绝口！</div>
					<div class="assess-tu">
						<img src="img/assess.png" alt="" />
						<img src="img/assess.png" alt="" />
						<img src="img/assess.png" alt="" />
					</div>
					<div class="type">
						<div>
							<span class="type_name">材质：</span><span class="material">进口松木/手绘艺术纸  </span>
						</div>
						<div>
							<span class="type_name">颜色： </span><span class="tinct">多色  </span>
						</div>
						<div>
							<span class="type_name">规格 : </span><span class="norms">长57.5X宽67.5X高2.8CMs</span>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
<!--评价列表-->
<script>

var swiper = new Swiper('.swiper-container', {
        pagination: '.swiper-pagination',
        paginationClickable: true,
        onTouchEnd: function(swiper){
         if(swiper.isEnd){

             mySwiper.slideTo(1,500,false);
            }else{

            }

        }
//      loop: true
//      autoplay: 3000
    });
    var mySwiper = new Swiper('.swiper-containerBox', {

    speed:500,
    pagination: '.swiper-pagination2',
    paginationClickable: true,
    onSlideChangeEnd: function (swiper) {
        var j=mySwiper.activeIndex;
        $('.nav_item').removeClass('color_yellow').eq(j).addClass('color_yellow');
    }

    })
    $('.nav_item').on('click', function (e) {
        e.preventDefault();
        //得到当前索引
        var i=$(this).index();
        $('.nav_item').removeClass('color_yellow').eq(i).addClass('color_yellow');
        mySwiper.slideTo(i,500,false);
    });
</script>
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
</body>
</html>